<template>
	<view>
		<app-dialog ref="dialog" width="100%" @confirm="save" bg="" :isFooter="false" :isClose="false">
			<view class="content">
				<view class="title">
					<view>新增视频</view>
					<u-icon name="close" color="#276329" size="36" @tap="close"></u-icon>
				</view>
				<view class="list">
					<u--form labelPosition="left" :model="model1" :rules="rules" ref="uForm" labelWidth="160rpx">
						<u-form-item label="视频名称：" prop="videoname" ref="item1">
							<u--input v-model="model1.videoname" placeholder="请输入视频名称"></u--input>
						</u-form-item>
						<u-form-item label="视频：" prop="videoupload" ref="item1">
							<!-- <button class="upload_button" @tap="afterRead()">
                <u-icon name="plus" color="#fff"></u-icon>
                添加视频
              </button> -->
							<u-upload @delete="del" width="160" height="160" :fileList="video" :compressed="true"
								:maxDuration="60" :capture="[ 'album']" name="2" @afterRead="afterRead" accept="video"
								:maxCount="1"></u-upload>
						</u-form-item>
					</u--form>
					<u-button type="primary" text="保存" customStyle="margin-top: 50px" @click="save"
						color="linear-gradient(to right, rgb(0, 150, 136), rgb(139, 195, 74))"></u-button>
				</view>
			</view>

		</app-dialog>

	</view>
</template>

<script>
	export default {
		components: {},
		data() {
			return {
				model1: {
					videoname: '',
					videoupload: ''
				},
				id:'',
				fileList1: [],
				video: [],
				rules: {
					videoname: {
						type: 'string',
						required: true,
						message: '请输入商家名称',
						trigger: ['blur', 'change']
					},
					videoupload: {
						type: 'string',
						required: true,
						message: '请上传视频',
						trigger: ['blur', 'change']
					},

				},
			}
		},
		onReady() {
			//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
			this.$refs.uForm.setRules(this.rules)
		},
		methods: {
			async afterRead(e) {

				this.video = [e.file];

			},
			/**
			 * 保存
			 */
			async save() {
				try {
					let videoRes = await this.$uploadFile("/app/sj/uploadSp", this.video[0].url, {
						sjid: this.id,
						spmc: this.model1.videoname
					}).then(res=>{
						
					})
					this.$emit('getList');
					this.$refs.dialog.close();
					
					///	this.$refs.dialog.close();
					//	this.hideLoading();
				} catch (e) {
					this.errorLoading(e);
				}
			},
			// 弹窗
			async open(id) {
				this.id = id
				// 打开弹框
				await this.$refs.dialog.open();
			},
			async close() {
				await this.$refs.dialog.close();
			},
			// // 新增图片
			// async afterRead() {

			// 	// //0 相册  1魔法
			// 	// if (this.star == "1") {
			// 	//   this.$refs.arUploadFileRef.open(this.flid);
			// 	// } else {
			// 	uni.chooseImage({
			// 		// count: 9, // 默认9, 设置图片的选择数量
			// 		// sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
			// 		sourceType: ['album', 'camera'], // 从相册选择
			// 		success: async (res) => {
			// 			console.log(res);
			// 			this.showLoading('上传中');
			// 			for (let item of res.tempFilePaths) {
			// 				await this.$uploadFile("/app/tp/uploadFile", item, {
			// 					sfar: 0,
			// 					flid: this.flid
			// 				})
			// 			}
			// 			this.hideLoading('上传完成');

			// 			// this.getList(1)
			// 		},
			// 		fail: (err) => {
			// 			// 处理错误情况
			// 			console.error(err);
			// 		}
			// 	});


			// 	// }

			// },
			//提交数据
			submit() {
				this.$refs.uForm.validate().then(res => {
					uni.$u.toast('校验通过')
					this.visible = false
					uni.navigateTo({
						url: "/pages/gly/gly_form"
					})
				}).catch(errors => {
					this.visible = false
					uni.$u.toast('校验失败')
				})
			}
		},

	}
</script>

<style scoped lang="scss">
	.content {
		width: 90%;
		margin: 0 auto;
		background: #fff;
		border-radius: 10rpx;
		padding: 20rpx;

		.title {
			height: 80rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			font-size: 32rpx;
			color: #276329;

		}

		.list {}
	}

	/deep/ .u-form {
		.u-form-item__body__right {
			border: 1rpx solid #276329 !important;
			height: 70rpx !important;
		}

		.u-form-item {
			&:nth-child(2) {
				.u-form-item__body__right {
					border: none !important;
					height: auto !important;
				}
			}
		}
	}

	.upload_button {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 180rpx;
		height: 68rpx;
		color: #333;
		font-family: PingFangSC;
		color: #ffffff;
		font-weight: 500;
		font-size: 32rpx;
		padding: 0;
		border-radius: 50px;
		background: linear-gradient(90deg, #13b1a2 0%, #276329 100%);
		border: none;
	}
</style>